<template>
    <div id="app">
      <el-container>
        <el-aside width="200px">
          <Aside></Aside>
        </el-aside>
        <el-container>
          <el-header>
            <Head></Head>
          </el-header>
          <el-main>
            <router-view></router-view>
          </el-main>
        </el-container>
      </el-container>
    </div>
  </template>
  
  <script>
  import Head from '@/views/Head.vue'
  import Aside from '@/views/Aside.vue'
  export default {
    data () {
      return {
  
      }
    },
    components: {
      Head,
      Aside
    }
  }
  </script>
  
  <style lang="less">
  html,
  body,
  #app {
    height: 100%;
    width: 100%;
    // background-color: pink;
    margin: 0;
    padding: 0;
    .el-container {
      height: 100%;
    }
    .el-aside {
      background-color: aqua;
    }
    .el-header {
      background-color: #545c64;
    }
    .el-main {
      background-color: antiquewhite;
    }
  }
  </style>